// 上传多图
$(".upimg").on("change", function() {
  loadMoreImage(this, 3);
});

function loadMoreImage(img, num) {
  var imgSize = 0;
  if (img.files.length > num) {
    layer.msg("上传的图片个数不能大于张" + num + '张,当前共有' + img.files.length + '张图片', function() {});
    return false;
  } else {
    for (var i = 0; i < img.files.length; i++) {
      var filePath = img.files[i].name;
      var fileExt = filePath.substring(filePath.lastIndexOf(".")).toLowerCase();
      if (!checkFileExt(fileExt)) {
        layer.msg("您上传的文件不是图片,请重新上传！", function() {});
        img.value = "";
        return;
      }
      if (img.files && img.files[i]) {
        imgSize = (img.files[i].size / 1024).toFixed(0);
        if (imgSize < 0) {
          layer.alert('无效图片，请重新选择');
          return false;
        } else {
          if (imgSize > 5120) {
            layer.alert('你选择的文件大小' + imgSize + "kb,请选择一张5M以内的图片文件。");
            return false;
          }
        }
      } else {
        img.select();
        var url = document.selection.createRange().text;
        try {
          var fso = new ActiveXObject("Scripting.FileSystemObject");
        } catch (e) {
          layer.alert('如果你用的是ie8以下 请将安全级别调低！');
        }
        imgSize = (fso.GetFile(url).size / 1024).toFixed(0);
        if (imgSize < 0) {
          layer.alert('无效图片，请重新选择');
          return false;
        } else {
          if (imgSize > 1024) {
            layer.alert('你选择的文件大小' + imgSize + "kb，请选择一张1M以内的图片文件。");
            return false;
          }
        }
      }
      var $input = $(img);
      var file = $input.get(0).files[i];
      var fd = new FormData();
      fd.append("file", file);
      var imgLen = $(".img-box li").length;
      if (imgLen > num - 1) {
        layer.msg("最多上传" + num + "张图片,当前共有" + imgLen + "张图片", function() {});
        return false;
      }

        var width=parseInt( $(img).css('width'));

        $(img).siblings(".img-url-box").html( `
    <div class="layui-progress layui-progress-big  layui-anim layui-anim-scaleSpring" lay-filter="demo"  lay-showPercent="true"  style="width: ${width-30}px;">
<div class="layui-progress-bar" lay-percent="0%">
            <span class="layui-progress-text">0%</span>
         </div>    
              </div>  
`)
        $('.layui-upload-file').attr('disabled',true);
        $('.layui-upload-icon').parent().css({'background-color':"#ccc"})
        $('.layui-upload-icon .layui-icon').css({'color':"#fff"})
      $.ajax({
        // "url": $scope.xhrUrl+"/upload",
        "url": "/api/file_upload/upload",
        "type": "post",
        "data": fd,
        "dataType": "json",
        "contentType": false,
        "processData": false,
        "success": function(data) {
          if (data.error == 0) {
            element.progress('demo', "100%");
             setTimeout(function(){
                 $(img).siblings(".img-url-box").html('')
                 $('.layui-upload-file').attr('disabled',false);
                 $('.layui-upload-icon').parent().css({'background-color':"#fff"})
                 $('.layui-upload-icon .layui-icon').css({'color':"#5FB878"});
               $('.pop-progress').remove();
             },1000)
            // var url = 'http://res.ikaibei.com/'+data.url;
            var url = data.url;
            var tpl = '<li class="img-upload-url">\
                                            <img src=' + url + ' alt="" data-value=' + data.url + ' class="img-url storeBanner">\
                                            <div class="delImg">×</div>\
                                        </li>';
            $(".img-box").append($(tpl));
            // var imgLength = $(".img-box li").length;
            // var tplurl = '<p class="img-url">banner图' + imgLength + '链接:\
            //  <input type="" name="" value = "' + url + '"></p>';
            // $(".img-url-box").append($(tplurl));
            var cover_arr_val = $("#cover_arr").val();
            if (cover_arr_val) {
              $("#cover_arr").val(cover_arr_val + "," + url);
            } else {
              $("#cover_arr").val(url);
            }
          }else{
              $(img).siblings(".img-url-box").html('');
              $('.layui-upload-file').attr('disabled',false);
              $('.layui-upload-icon').parent().css({'background-color':"#fff"})
              $('.layui-upload-icon .layui-icon').css({'color':"#5FB878"});
          }
        }
      })
    }
  }

  // 请求上传
}

//删除封面图
$(".img-box").on("click", ".delImg", function() {
  var _this = $(this);
  var this_url = _this.parents(".img-upload-url").find(".img-url").attr("data-value"); //当前图片地址
  console.log(this_url);
  var all_imgurl_group = $("#cover_arr").val().split(",");
  for (var i = 0; i < all_imgurl_group.length; i++) {
    if (this_url == all_imgurl_group[i]) {
      all_imgurl_group.splice(i, 1);
      $("#cover_arr").val(all_imgurl_group.toString());
      _this.parents(".img-upload-url").remove();
      return false;
    }
  }
});

function checkFileExt(ext) {
  if (!ext.match(/.jpg|.gif|.png|.bmp/i)) {
    return false;
  }
  return true;
}
// 上传单图
$(".up_img").on("change", function() {
  loadImage(this);
});
// 单图上传
function loadImage(img) {
  var imgSize = 0;
  var filePath = img.files[0].name;
  var fileExt = filePath.substring(filePath.lastIndexOf(".")).toLowerCase();

  if (!checkFileExt(fileExt)) {
    layer.alert("您上传的文件不是图片,请重新上传！");
    img.value = "";
    return;
  }
  if (img.files && img.files[0]) {
    imgSize = (img.files[0].size / 1024).toFixed(0);
    if (imgSize < 0) {
      layer.alert('无效图片，请重新选择');
      return false;
    } else {
      if (imgSize > 1024) {
        layer.alert('你选择的文件大小' + imgSize + "kb,请选择一张1M以内的图片文件。");
        return false;
      }
    }
  } else {
    img.select();
    var url = document.selection.createRange().text;
    try {
      var fso = new ActiveXObject("Scripting.FileSystemObject");
    } catch (e) {
      layer.alert('如果你用的是ie8以下 请将安全级别调低！');
    }
    imgSize = (fso.GetFile(url).size / 1024).toFixed(0);
    if (imgSize < 0) {
      layer.alert('无效图片，请重新选择');
      return false;
    } else {
      if (imgSize > 1024) {
        layer.alert('你选择的文件大小' + imgSize + "kb，请选择一张1M以内的图片文件。");
        return false;
      }
    }
  }
  var $input = $(img);
  var file = $input.get(0).files[0];
  var fd = new FormData();
  fd.append("file", file);
  $.ajax({
    "url": $scope.xhrUrl + "/upload",
    "type": "post",
    "data": fd,
    "dataType": "json",
    "contentType": false,
    "processData": false,
    "success": function(data) {
      if (data.code == 0) {
        $input.attr("data-value", data.url);
        var url = $scope.commonpicUrl + data.url;
        setTimeout(function() {
          $input.siblings('img').attr("src", url)
        }, 50)
        element.progress('demo', "100%");
         setTimeout(function(){
           $('.pop-progress').remove();
         },500)
      }
    }
  })
  // 请求上传
}

function checkFileExt(ext) {
  if (!ext.match(/.jpg|.jpeg|.gif|.png|.bmp/i)) {
    return false;
  }
  return true;
}
